<template>
  <el-carousel :interval="5000" arrow="always" v-if="previewData.previewImg.length > 0">
    <el-carousel-item
      v-for="(item, index) in previewData.previewImg"
      :key="item.id"
      :label="index + 1"
    >
      <img :src="item.url" alt="" style="width: 100%; height: 100%;"/>
    </el-carousel-item>
  </el-carousel>
</template>

<script>
export default {
  name: "Template_3",
  props: {
    previewData: {
      type: Object,
      default: null,
    },
  },
  data() {
    return {};
  },
};
</script>

<style scoped lang="scss">
.el-carousel--horizontal {
    height: 650px;
  ::v-deep .el-carousel__container {
    height: 600px;
  }
  ::v-deep .el-carousel__indicators--labels {
    .el-carousel__indicator {
      padding: 12px 8px;
      font-size: 16px;
    }
  }
}
</style>